<div class="parent">
    <h2>Spy Directive</h2>

    <input [(ngModel)]="newName" (keyup.enter)="addHero()">
    <button (click)="addHero()">Add Hero</button>
    <button (click)="reset()">Reset Heroes</button>

    <p></p>
    <div *ngFor="let hero of heroes" [mySpy]="hero" class="heroes">
        {{hero}}
    </div>
    <h4>-- Spy Lifecycle Hook Log --</h4>
    <div *ngFor="let msg of spyLog">{{msg}}</div>
</div>